<template>
  <div class="app-container">
    <div class="searchBox">
      <el-form :inline="true" :model="search" ref="searchForm">
        <el-form-item label="代理人：">
          <el-input
            v-model="search.agentUserName"
            placeholder="请输入内容"
          ></el-input>
        </el-form-item>

        <el-form-item>
          <el-button type="primary" @click="searchQuery">查询</el-button>
          <el-button
            type="info"
            @click="
              search = {};
              searchQuery();
            "
            >重置</el-button
          >
        </el-form-item>
      </el-form>
    </div>

    <qm-table
      :data="query"
      :showOrder="false"
      :showView="false"
      :menuOptions="{ width: 100 }"
      :modalOptions="{height: 500}"
      menuType="text"
      ref="qmTable"
      keyProp="delegateId"
      :formValidate="defaultFormValidate"
      isCustomForm
      :textMap="{ add: '新增委托' }"
    >
      <qm-table-column field="agentUserName">代理人</qm-table-column>
      <qm-table-column field="delegateDate" fieldType="datetime">
        委托时间
      </qm-table-column>
      <qm-table-column field="agentStartDate" fieldType="datetime">
        代理开始时间
      </qm-table-column>
      <qm-table-column field="agentEndDate" fieldType="datetime">
        代理结束时间
      </qm-table-column>
      <qm-table-column
        field="delegateType"
        fieldType="enum"
        :enumOptions="controlData.delegateTypeOptions"
      >
        委托类型
      </qm-table-column>

      <template v-slot:form="{ models, controlData }">
        <create
          ref="create"
          :models="models"
          :controlData="controlData"
        ></create>
      </template>
    </qm-table>
  </div>
</template>

<script>
import Controller from "@/libs/framework/controller";
import Create from "./create";

// 后端定义的枚举类
const DESIGNATED_LINK_DELEGATE_KEY = "designatedLinkDelegate";
const DESIGNATED_CATEGORY_ALL_DELEGATE_KEY = "designatedCategoryAllDelegate";

export default class Instance extends Controller {
  onBeforeInit() {
    this.urls = {
      model: "/workflow/actExtDelegate/getListModel",
      query: "/workflow/actExtDelegate/query",
      save: "/workflow/actExtDelegate/save",
      delete: "/workflow/actExtDelegate/delete",
      entity: "/workflow/actExtDelegate/getEntity",
    };
  }

  onBeforeSave(postModel) {
    const { model, categoryAllDelegates } = postModel;
    if (DESIGNATED_LINK_DELEGATE_KEY === model.delegateType) {
      if(!postModel.delegates || postModel.delegates.length == 0){
        this.$alert("请填写指定环节进行委托");
        return false;
      }
      postModel.categoryAllDelegates = [];
    } else if (DESIGNATED_CATEGORY_ALL_DELEGATE_KEY === model.delegateType) {
      if(!categoryAllDelegates || categoryAllDelegates.length == 0){
        this.$alert("请填写指定类别进行委托");
        return false;
      }
      postModel.categoryAllDelegates = JSON.stringify(categoryAllDelegates);
      postModel.delegates = [];
    }
    return true;
  }

  mixin() {
    return {
      components: {
        Create,
      },
      data() {
        return {};
      },
      methods: {},
    };
  }
}
</script>

<style scoped lang="scss">
.fa-circle {
  font-size: large;
}

.fa-circle.red {
  color: red;
}

.fa-circle.yellow {
  color: orange;
}

.fa-circle.green {
  color: green;
}
</style>
